<template>
  <div>
    <Suspense>
      <template #default>
        <girl-show />
      </template>
      <template #fallback>
       <h1>Loading......</h1>
      </template>
    </Suspense>
  </div>
</template>
<script lang="ts">
import { ref,onErrorCaptured } from "vue";
import useUrlAxios from "./hooks/useUrlAxios";
import AsyncShow from "./components/AsyncShow.vue";
import GirlShow from "./components/GirlShow.vue"
const app = {
  name: "App",
  components: {AsyncShow,GirlShow },
  setup() {
    onErrorCaptured((error)=>{
      console.log(`error=====>`,error)
      console.log(error)
    })
    return {};
  },
};
export default app;
</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>